Grid Layout vs. Flow Layout

 

Note: The following definitions are from Visual Studio Help:

Grid Layout - Absolute positioning attributes are inserted into elements that are added, and updated in elements that are moved. Elements can be dragged across the Design view surface. The positioning grid and Snap to Grid are available.

Flow Layout - Elements are added without absolute positioning attributes. Web browsers arrange elements in the order that they occur on the page, from top to bottom. You cannot drag elements across the Design view surface or use the positioning grid.

Grid layout is the default, which means that all controls drawn to the Web form in the designer window will have absolute positioning. Here is an example.

<body MS_POSITIONING="GridLayout">

 <form id="Form1" method="post" runat="server">

  <asp:Button id="Button1" style="Z-INDEX: 101; LEFT: 160px; POSITION: absolute; TOP: 80px" runat="server" Text="Button"></asp:Button>

  <asp:Button id="Button2" style="Z-INDEX: 102; LEFT: 480px; POSITION: absolute; TOP: 88px" runat="server" Text="Button"></asp:Button>

  <asp:GridView id="GridView1" style="Z-INDEX: 103; LEFT: 208px; POSITION: absolute; TOP: 152px" runat="server"></asp:GridView>

 </form>

</body>

In Grid layout, you can position your controls like a WYSIWYG editor with no knowledge of HTML. However, because absolute positioning is not rendered consistently by all browsers, the page layout can be flexible based on the size of other controls on the page, and the Web browser window.

When other controls are dynamically populated, such as a GridView, controls that appear beneath it in the Web form would be obscured if they were positioned absolutely at design time. In addition, when utilizing globalization of pages with different languages, the size of text areas can vary and cause obstructions.

Previous TopicNext Topic|